<template>
<uni-shadow-root class="partials-title-title"><import src="product_search.wxml"></import>
<import src="headline.wxml"></import>
<import src="pupu_product_search.wxml"></import>
<import src="more_product_search.wxml"></import>
<import src="popup_page.wxml"></import>
<import src="form_search.wxml"></import>
<block v-if="receiveData.androidTemplate == """>
    <template is="pt_4_0" :data="...receiveData,properties"></template> 
</block>
<block v-if="receiveData.androidTemplate == "product_search"">
    <template is="pt_4_search" :data="...receiveData,properties"></template> 
</block>
<block v-if="receiveData.androidTemplate == "pupu_product_search"">
    <template is="pupu_product_search" :data="...receiveData,setting,properties"></template> 
</block>
<block v-if="receiveData.androidTemplate == "form_search"">
    <template is="form_search" :data="...receiveData,setting,properties,formType"></template> 
</block>
<block v-if="receiveData.androidTemplate == "title_gzh"">
    <official-account></official-account>
</block>
<block v-if="receiveData.androidTemplate == "more_product_search"">
    <template is="more_product_search" :data="...receiveData,setting,properties"></template> 
</block>
<block v-if="receiveData.androidTemplate == "popup_page"">
    <template is="popup_page" :data="findNotifyTipsItem,showPopup,animationData,setting,properties"></template> 
</block></uni-shadow-root>
</template>

<script>

global['__wxRoute'] = 'partials/title/title'
import { socketFun } from "../../public/json2Form.js";
const app = getApp();
var timeTimeout
  Component({
  properties: {
    receiveData: {
      type: JSON,
    }
  },
    data: {
      someData: { },
      findNotifyTipsData:null,
      findNotifyTipsItem:null,
      showPopup:false,
      animationData:{},
      timer:null,
      numberTime: 0,
      properties:{},
    },
    lifetimes: {
      attached: function () {
        console.log("========attached=============")
        socketFun.addListener( "defaultUserChat",  function(msg){
            console.log("hello!!!",msg);
            return true;
        });
        let that = this;
        console.log("==========title=============", that.data.receiveData)
        that.setData({ setting: app.globalData.setting, properties: app.globalData.properties })
        console.log("==========setting=============", that.data.setting.platformSetting.defaultColor)
        if (that.data.receiveData.androidTemplate == "popup_page") {
          that.findNotifyTipsFun();
        } 
        if (that.data.receiveData.androidTemplate == "form_search"){
          that.getFormType();
        }
      },
      detached: function () {
        // 在组件离开页面节点树后， detached 生命周期被触发
        let that = this;
        if (that.data.receiveData.androidTemplate == "popup_page") {
          console.log("==========detached=============")
          that.clearInterval()
          clearTimeout(timeTimeout)
          // app.globalData.notifyTipPage.clearInterval();
          // app.globalData.preNotifyTipPage.clearInterval();
          // app.globalData.notifyTipPage = app.globalData.preNotifyTipPage;
          // app.globalData.notifyTipPage.findNotifyTipsFun();
        }
      },
    },
    pageLifetimes: {
      show: function () {
        // 页面被展示(主页之间的切换)
        console.log("=====页面被展示=====")
        let that = this;
        if (that.data.receiveData.androidTemplate == "popup_page") {
          that.setData({ numberTime: 0 })
          that.findNotifyTipsFun();
        }
      },
      hide: function () {
        // 页面被隐藏(主页之间的切换)
        console.log("=====页面被隐藏=====")
        let that = this;
        if (that.data.receiveData.androidTemplate == "popup_page") {
          console.log("==========组件hide=============")
          clearTimeout(timeTimeout)
          that.clearInterval()
          // app.globalData.notifyTipPage.clearInterval();
          // app.globalData.preNotifyTipPage.clearInterval();
          // app.globalData.notifyTipPage = app.globalData.preNotifyTipPage;
          // app.globalData.notifyTipPage.findNotifyTipsFun();
        }
      },
    },
    methods: {//获取表单分类
      bindPickerChange:function(){
        
      },
      getFormType: function (groupName, callback) {
        let customIndex = app.globalData.AddClientUrl("/wx_find_custom_forms.html")
        app.globalData.showToastLoading('loading', true)
        let that = this
        wx.request({
          url: customIndex.url,
          header: app.globalData.header,
          success: function (res) {
            wx.hideLoading()
            console.log("getFormType", res.data)
            if (res.data.errcode == 0) {
              let formType= res.data.relateObj.result
              that.setData({ formType: formType})
            }
            wx.hideLoading()
          },
          fail: function (res) {
            console.log("fail")
            wx.hideLoading()
            app.globalData.loadFail()
          }
        })
      },
      // 这里是一个自定义方法
      findNotifyTipsFun: function () {
        // if (app.globalData.notifyTipPage){
        //   app.globalData.preNotifyTipPage=app.globalData.notifyTipPage;
        //   app.globalData.notifyTipPage.clearInterval();
        //   app.globalData.preNotifyTipPage.clearInterval();
        // }
        // app.globalData.notifyTipPage=this;
        // var that = app.globalData.notifyTipPage;
        let that = this;
        var customIndex = app.globalData.AddClientUrl("/wx_find_notify_tips.html", { test: 1 })
        wx.request({
          url: customIndex.url,
          header: app.globalData.header,
          success: function (res) {
            wx.hideLoading()
            console.log("findNotifyTipsFun", res.data, that.data.numberTime)
            if (res.data.errcode == 0) {
              let findNotifyTipsData = res.data.relateObj.result
              that.setData({ findNotifyTipsData: findNotifyTipsData, showPopup: true })
              let count=0;
              let numberTime = that.data.numberTime
              // that.data.timer = setInterval(function () {
              //   console.log("===========timer get order detail============");
              //   if (count==0){
              //     console.log("========从头开始===========")
              //     that.setData({ numberTime: 5000 })
              //   }
              //   if (count < findNotifyTipsData.length) {
              //     that.getFindNotifyTipsItem(findNotifyTipsData[count])
              //     count++
              //   } else {
              //     that.setData({ numberTime: 60000 - (count * 5000) })
              //     that.clearInterval()
              //     that.findNotifyTipsFun()
              //   }
              // }, numberTime);
              timeTimeout=setTimeout(function(){
                that.data.timer = setInterval(function () {
                  console.log("===========timer get order detail============");
                  if (count < findNotifyTipsData.length) {
                    that.getFindNotifyTipsItem(findNotifyTipsData[count])
                    count++
                  } else {
                    that.setData({ numberTime: 60000 - (count * 5000)})
                    that.clearInterval()
                    that.findNotifyTipsFun()
                  }
                }, 5000);
              }, numberTime)
            } else {

            }
            wx.hideLoading()
          },
          fail: function (res) {
            console.log("fail")
            wx.hideLoading()
            app.globalData.loadFail()
          }
        })
      },
      clearInterval:function(data){
        let that=this;
        console.log("=====clearInterval=====", data)
        if (that.data.showPopup){
          let timer = that.data.timer
          clearInterval(timer);
          that.setData({ showPopup: false, timer: null })
        }
      },
      getFindNotifyTipsItem: function (findNotifyTipsItem){
        // let that = app.globalData.notifyTipPage;
        let that = this;
        let animation = wx.createAnimation({
          duration: 400,
          timingFunction: 'ease',
        })
        animation.opacity(1).step()
        that.setData({
          animationData: animation.export(),
        })
        console.log("=====findNotifyTipsItem====", findNotifyTipsItem)
        that.setData({ findNotifyTipsItem: findNotifyTipsItem })
        setTimeout(function(){//停留4S
          animation.opacity(0).step()
          that.setData({
            animationData: animation.export(),
          })
        },4000)
      },
      /* 搜索 */
      changeSearchProductFun:function(data){
        let that=this;
        if (that.data.receiveData.androidTemplate == "more_product_search"){
          console.log("===changeSearchProductFun===", data)
        }
      },
      searchProduct: function (e) {
        var product = e.detail.value
        console.log(product)
        var param = {}
        param.productName = product
        let postParam = app.globalData.jsonToStr(param)
        // app.globalData.productParam = param
        wx.navigateTo({
          url: '/pages/search_product/index' + postParam
        })
      },
      tolinkUrl: function (event) {
        console.log(event.currentTarget.dataset.link)
        app.globalData.linkEvent(event.currentTarget.dataset.link);
      }
  }
})
export default global['__wxComponents']['partials/title/title']
</script>
<style platform="mp-weixin">
.showSearchTitle{
  padding: 5px 10px 5px 10px;
  background: #fff;
}
.showSearchTitle > view{
  width: 100%;
  height: 20px;
  border: 1px solid #ddd;
   border-radius: 10px; 
}
.showSearchTitle_searchContainer input{
  height: 100%;
  width: 50%;
}
.TitleHeadSearch1{
  width: 100%;
  height: 44px;
  background: #F77965;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.TitleHeadSearch1 .TitleHeadSearch_input1{
  background: #fff;
  height:29px;
  width: 90%;
  border-radius: 14px;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: left;
}
.TitleHeadSearch_input1 image{
  height: 1.2em;
  width: 1.2em;
}
.TitleHeadSearch_input1 input{
  font-size: 0.7em;
  height: 100%;
  width: 80%;
}
.TitleHeadSearch2{
  width: 100%;
  background: #EEEEEE;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.TitleHeadSearch2 .TitleHeadSearch_input2{
  background: #fff;
  width: 90%;
  border-radius: 5px;
  border: 1px solid #ddd;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  margin: 13rpx;
}
.TitleHeadSearch_input2 image{
  height: 1.2em;
  width: 1.2em;
}
.TitleHeadSearch_input2 input{
  font-size: 0.7em;
  height: 100%;
  width: 80%;
}
/* 普通 */
.titleType0{
  padding: 10px 10px;
}
.titleType0 > .T_head{

}
.titleType0 > .T_right{
  margin-left: 5px;
}
.titleType1{
  padding: 5px 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.titleType2{
  padding: 5px 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.titleType2 > .T_right{
  height: 20px;
  width: 20px;
}
 .T_right >image{
  height: 100%;
  width: 100%;
}
.titleType5{
  padding: 5px 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.titleType5 > .T_head{
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.T_head image{
  height: 20px;
  width: 20px;
}
.T_head text{
  margin-left: 10px;
}
/* pupu */
.search_top{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.search_input{
  background: #fff;
  border-radius: 20rpx;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 92%;
  margin:10rpx 20rpx;
  padding:0 20rpx;
  box-sizing:border-box;
}
.search_input_text{
  font-size: 28rpx;
  width:90%;
  text-align:center;
}
.search_input_icon{
  width:34rpx;
  height:34rpx;
  padding:10rpx
}
.phcolor{
  color: #999
}
.popup_page_list{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 10%;
  left: 10rpx;
  background: #00000099;
  color: #fff;
  border-radius:10rpx;
  opacity: 0;
  z-index: 1000,
}
.popup_page_item{
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 24rpx;
}
.user_text{
  padding:16rpx;
}
.user_icon{
  width: 60rpx;
  height: 60rpx;
  border-top-left-radius: 10rpx;
  border-bottom-left-radius: 10rpx;
  margin-left:-1rpx;
}
/* 表单搜索 */
.picker{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.pickerValue{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  color: #999;
  width: 600rpx;
  font-size: 26rpx;
  text-align: center;
}
.pickerRight{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 6rpx 0;
}
.pickerImg{
  width: 30rpx;
  height: 30rpx;
}
</style>